<template>
  <el-dialog
    v-model="dialogVisible"
    :title="title"
    width="1000"
    @close="onClose"
  >
    <slot></slot>
  </el-dialog>
</template>
<script setup>
import { ref, watch } from "vue";
const props = defineProps({
  dialogVisible: {
    // 弹窗是否显示
    type: Boolean,
    default: false,
  },
  title: {
    // 弹窗标题
    type: String,
    default: "新增弹窗",
  },
});
const emit = defineEmits(["update:dialogVisible", "close"]);

const dialogVisible = ref(false);
watch(
  () => props.dialogVisible,
  (newVal) => {
    if (newVal !== dialogVisible.value) {
      dialogVisible.value = newVal;
    }
  }
);

const onClose = () => {
  dialogVisible.value = false;
  emit("close", dialogVisible.value);
};
</script>
